<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<title>02-CSS语言的简单应用</title>
	<link href="02-css_application.css" rel="stylesheet" type="text/css" >
</head>
<body>
	<!----------------------------1、导航条----------------------------->
	<div class="div_01">
		<h1 id="div_01_title_01">1、导航条的使用</h1>
		 <ul class="div_01_navigationBar">
		 	<li class="div_01_navigationBar_home"><a href="#home">主页</a></li>
		 	<li class="div_01_navigationBar_news"><a href="#home">新闻</a></li>
		 	<li class="div_01_navigationBar_connet"><a href="#home">联系我们</a></li>
		 	<li class="div_01_navigationBar_about"><a href="#home">关于我们</a></li>
		 </ul>

		 <div class="div_01_rightContent">
		  <p>Some text..</p>
		  <p>Some text..</p>
		  <p>Some text..</p>
		  <p>Some text..</p>
		  <p>Some text..</p>
		  <p>Some text..</p>
		  <p>Some text..</p>
		</div>
	</div>
	<!----------------------------2、水平导航条----------------------------->
	<div class="div_02">
		<h1 id="div_02_title_02">2、水平导航条</h1>
         <ul class="div_02_navigationBar">
		 	<li class="div_02_navigationBar_home"><a href="#home">主页</a></li>
		 	<li class="div_02_navigationBar_news"><a href="#home">新闻</a></li>
		 	<li class="div_02_navigationBar_connet"><a href="#home">联系我们</a></li>
		 	<div class="div_02_dropdown">
		 		 <a href="#" class="dropbtn">下拉菜单</a>
			     <div class="dropdown-content">
			      <a href="#">链接 1</a>
			      <a href="#">链接 2</a>
			      <a href="#">链接 3</a>
			     </div>
		 	</div>
		 	<!-- <li class="div_0_navigationBar_about"><a href="#home">关于我们</a></li> -->
         </ul>

	</div>

</body>
</html>